<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="include/common-header :: common_header(~{::title},~{::link})">
    <title>经费激活</title>
</head>
<body class="gray-bg">

<!--页面内容开始-->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-title">
                    <h5>待激活经费</h5>
                </div>
                <div class="ibox-content">
                    <div class="table-responsive">
                        <div class="m-l-xs toolbar" id="moneyinfodetailActive_toolbar">
                            <form role="form" id="moneyinfodetailActive_query_form" class="form-inline">
                                <div class="form-group m-r-xs">
                                    <label for="moneyinfodetailActive_moneyTypeCode" class="sr-only">经费类型</label>
                                    <select class="form-control" id="moneyinfodetailActive_moneyTypeCode"
                                            name="moneyTypeCode">
                                        <option value="">-- 请选择 --</option>
                                        <option value="001">直接支付</option>
                                        <option value="002">授权支付</option>
                                        <option value="003">自有资金</option>
                                    </select>
                                </div>
                                <div class="form-group m-r-xs">
                                    <label for="moneyinfodetailActive_key" class="sr-only">预算项目</label>
                                    <input type="text" class="form-control" id="moneyinfodetailActive_key"
                                           name="key" placeholder="预算项目/经济分类">
                                </div>
                                <div>
                                    <button class="btn btn-primary" type="button"
                                            onclick="moneyinfodetailActiveObj.refreshTable()">查询
                                    </button>
                                    <button class="btn btn-white" type="button"
                                            onclick="moneyinfodetailActiveObj.resetTable()">重置
                                    </button>
                                </div>
                            </form>
                        </div>
                        <table id="moneyinfodetailActive_table" class="table table-striped"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--页面内容结束-->
<div th:replace="include/common-js :: common_js"></div>
<!--弹窗：经费激活-->
<div th:replace="web/money/cur/moneyinfodetail-active-edit::moneyinfodetailActiveEdit"></div>

<script type="text/javascript">
    $(function () {
        moneyinfodetailActiveObj.myTable = $('#moneyinfodetailActive_table').bootstrapTable({
            toolbar: '#moneyinfodetailActive_toolbar',
            pagination: true,
            sidePagination: 'server',
            method: 'post',
            clickToSelect: true,
            queryParams: function (param) {
                param.moneyTypeCode = $("#moneyinfodetailActive_moneyTypeCode").val();
                param.key = $('#moneyinfodetailActive_key').val();
                param.queryState = 0;
                return param;
            },
            url: "/money/cur/moneyinfodetail",
            formatNoMatches: function () {  //没有匹配的结果
                return '暂无数据';
            },
            columns: [{
                title: '#',
                align: 'center',
                width: 50,
                formatter: function (value, row, index) {
                    return index + 1;
                }
            }, {
                title: '经费类型',
                field: 'moneyTypeName'
            }, {
                title: '预算项目',
                field: 'projectName',
                formatter: function (value, row, index) {
                    return value + `(${row.projectCode})`;
                }
            }, {
                title: '经济分类',
                field: 'cateName',
                formatter: function (value, row, index) {
                    return value + `(${row.cateCode})`;
                }
            }, {
                title: '金额',
                field: 'money',
                formatter: function (value, row, index) {
                    return $.moneyFormat(value);
                }
            }, {
                title: '创建时间',
                field: 'createTime'
            }, {
                title: '操作',
                width: 60,
                events: {
                    'click .active': function (e, value, row, index) {
                        moneyinfodetailActiveObj.activeHandle(row.id)
                    }
                },
                formatter: function (value, row, index) {
                    var opers = [];
                    opers.push(`<a class="active btn btn-white btn-bitbucket text-success" data-toggle="tooltip" title="激活">
                                    <i class="fa fa-thumbs-up"></i>
                                </a>`)
                    return opers.join('');
                }
            }],
            responseHandler: function (res) {
                return {
                    total: res.page.totalCount,
                    rows: res.page.list
                };
            },
            onLoadSuccess: function (data) {
                $('[data-toggle="tooltip"]').tooltip()
            }
        });
    })
    var moneyinfodetailActiveObj = new Object({
        myTable: undefined,
        refreshTable: function () {
            this.myTable.bootstrapTable('refresh')
        },
        resetTable: function () {
            $('#moneyinfodetailActive_query_form')[0].reset();
            this.refreshTable();
        },
        activeHandle: function (id) {
            moneyinfodetailActiveEditObj.init(id)
        }
    })
</script>
</body>
</html>